import { useEffect } from 'react';
import BlosugarCharts from './components/BlosugarCharts';
import HamCharts from './components/HamCharts';
import OxiCharts from './components/OxiCharts';
import TemperCharts from './components/TemperCharts';

interface Iprops {
  patientId: number | undefined;
}

const PhysiologicalMonitoring = (props: Iprops) => {
  const { patientId } = props;
  useEffect(() => {
    console.log('123');
  }, [patientId]);
  return (
    <div>
      <div style={{ display: 'flex', justifyContent: 'space-around' }}>
        <div>
          <HamCharts editId={patientId}></HamCharts>
        </div>
        <div>
          <OxiCharts editId={patientId}></OxiCharts>
        </div>
      </div>
      <div style={{ display: 'flex', justifyContent: 'space-around', marginTop: '20px' }}>
        <div>
          <BlosugarCharts editId={patientId}></BlosugarCharts>
        </div>
        <div>
          <TemperCharts editId={patientId}></TemperCharts>
        </div>
      </div>
    </div>
  );
};
export default PhysiologicalMonitoring;
